<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <title>Document</title>
    <style>
        li:first-child { /*选择第一个孩子*/
            color: beige;
        }
        li:last-child {  /*选择最后一个孩子*/
            color: purple;
        }
        li:nth-child(2){
            color: red;
        }
        li:nth-child(odd){  /*可以选择所有的奇数的孩子*/
            color: pink;
        }
        li:nth-child(even){  /*可以选择所有的偶数的孩子*/
            color: green;
        }
        /* li:nth-child(2n){  !*n是从0开始的*!  从第一个孩子开始数  正数*/
        /*    color: green;*/
        /*}*/
      li:nth-last-child(even) {   /*nth-last-child从最后一个孩子开始数  倒数*/
        color: skyblue;
      }
      </style>
  </head>
  <body>
    <ul>
        <li>第一个孩子</li>
        <li>第二个孩子</li>
        <li>第三个孩子</li>
        <li>第四个孩子</li>
        <li>第五个孩子</li>
    </ul>
 </body>
</html>
